<!--template_01 模板-->
<template>
  <!-- 信息录入 -->
  <div class="box boxHtml">
    <el-form
      class="addInfor"
      label-width="130px"
      size="small"
      :inline="true"
      ref="inforForm"
      :model="form"
      :rules="formRules"
    >
      <div class="form_wrap clearfix">
        <el-form-item
          label="借款人姓名:"
          prop="basicBorrowerName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.basicBorrowerName"></el-input>
        </el-form-item>
        <el-form-item
          label="身份证号码:"
          prop="basicBorrowerCard"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="18" v-model="form.basicBorrowerCard"></el-input>
        </el-form-item>
        <el-form-item
          label="联系电话:"
          prop="basicBorrowerPhone"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="11"  v-model="form.basicBorrowerPhone"></el-input>
        </el-form-item>
        <el-form-item
          label="现住地址:"
          prop="basicBorrowerAddress"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.basicBorrowerAddress"></el-input>
        </el-form-item>
        <el-form-item
          label="工作单位:"
          prop="basicBorrowerWork"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.basicBorrowerWork"></el-input>
        </el-form-item>
        <el-form-item
          label="婚姻状况"
          prop="basicBorrowerMarriage"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.basicBorrowerMarriage">
            <el-option
              v-for="item in Marriage"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="借款人资质:"
          prop="litigation"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.qualification">
            <el-option
              v-for="item in BorrowerQualification"
              :key="item.itemText"
              :label="item.itemValue"
              :value="item.itemText"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="签约类型"
          prop="signType"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.signType">
            <el-option
              v-for="item in signing"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="是否有涉诉"
          prop="litigation"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.litigation">
            <el-option
              v-for="item in litigation"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="服务费"
          prop="serviceCharge "
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.serviceCharge ">
            <el-option
              v-for="item in serviceCharge"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="担保约定执行方式"
          prop="executePattern "
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.executePattern ">
            <el-option
              v-for="item in fbyzzxfs"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
      </div>
      <div class="form_wrap clearfix" v-if="showMate">
        <el-form-item
          label="配偶姓名:"
          prop="basicBorrowerMateName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.basicBorrowerMateName"></el-input>
        </el-form-item>
        <el-form-item
          label="身份证号码:"
          prop="basicBorrowerMateCard"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="18" v-model="form.basicBorrowerMateCard"></el-input>
        </el-form-item>
        <el-form-item
          label="联系电话:"
          prop="basicBorrowerMatePhone"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="11" v-model="form.basicBorrowerMatePhone"></el-input>
        </el-form-item>
        <el-form-item
          label="现住地址:"
          prop="basicBorrowerMateAddress"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.basicBorrowerMateAddress"></el-input>
        </el-form-item>
        <el-form-item
          label="工作单位:"
          prop="basicBorrowerMateWork"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.basicBorrowerMateWork"></el-input>
        </el-form-item>
      </div>
      <div class="form_wrap clearfix">
        <el-form-item
          label="抵押人姓名:"
          prop="pledgeName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeName"></el-input>
        </el-form-item>
        <el-form-item
          label="身份证号码:"
          prop="pledgeCard"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="18" v-model="form.pledgeCard"></el-input>
        </el-form-item>
        <el-form-item
          label="联系电话:"
          prop="pledgePhone"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="11" v-model="form.pledgePhone"></el-input>
        </el-form-item>
        <el-form-item
          label="抵押共有人:"
          prop="pledgeMateName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeMateName"></el-input>
        </el-form-item>
        <el-form-item
          label="身份证号码:"
          prop="pledgeMateCard"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="18" v-model="form.pledgeMateCard"></el-input>
        </el-form-item>
        <el-form-item
          label="联系电话:"
          prop="pledgeMatePhone"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input :maxlength="11" v-model="form.pledgeMatePhone"></el-input>
        </el-form-item>
      </div>
      <div style="text-align: right; margin-top: 20px">
        <el-button type="primary" size="small" v-if="showTwo" @click="houseTwo"
          >删除第二套抵押地址</el-button
        >
        <el-button type="primary" size="small" v-else @click="houseTwo"
          >添加第二套抵押地址</el-button
        >
      </div>

      <div class="form_wrap clearfix">
        <el-form-item
          label="抵押物地址:"
          prop="pledgeHouseAddress"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeHouseAddress" maxlength="50"></el-input>
        </el-form-item>
        <el-form-item
          label="请选择省"
          prop="provinceName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select
            v-model="form.provinceName"
            @change="provinceFun"
            placeholder="请选择"
          >
            <el-option
              v-for="item in provinceData"
              :key="item.id"
              :label="item.value"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="请选择市"
          prop="cityName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select
            v-model="form.cityName"
            placeholder="请选择"
            :no-data-text="cityText"
            @change="cityFun"
          >
            <el-option
              v-for="item in cityData"
              :key="item.id"
              :label="item.value"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="请选择区"
          prop="areaName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select
            v-model="form.areaName"
            placeholder="请选择"
            :no-data-text="areaText"
            @change="areaFun"
          >
            <el-option
              v-for="item in areaData"
              :key="item.id"
              :label="item.value"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="小区名字:"
          prop="pledgeHouseName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeHouseName"></el-input>
        </el-form-item>
        <el-form-item
          label="房屋类型:"
          prop="pledgeHouseType"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.pledgeHouseType" placeholder="请选择">
            <el-option
              v-for="item in pledgeHouse"
              :key="item.value"
              :label="item.value"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="建筑面积:"
          prop="pledgeHouseArea"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.pledgeHouseArea" type="Number">
            <template slot="append">（平方米）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="房评估价:"
          prop="pledgePreliminaryMoney"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.pledgePreliminaryMoney" type="Number">
            <template slot="append">（万元）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="评估价格:"
          prop="evaluationPrice"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.evaluationPrice" type="Number">
            <template slot="append">（万元）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="一抵抵押银行:"
          prop="pledgeOneBank"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeOneBank"></el-input>
        </el-form-item>
        <el-form-item
          label="一抵抵押余额:"
          prop="pledgeOneBalance"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.pledgeOneBalance" type="Number">
            <template slot="append">（万元）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="本次申请金额:"
          prop="basicLoansMoney"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.basicLoansMoney" type="Number">
            <template slot="append">（万元）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="本次申请期限:"
          prop="basicLoansMonths"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.basicLoansMonths" type="Number">
            <template slot="append">（个月）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="本次申请产品:"
          prop="productProperty"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.productProperty" placeholder="请选择">
            <el-option
              v-for="item in productProSelect"
              :key="item.itemValue"
              :label="item.itemText"
              :value="item.itemValue"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="土地性质:"
          prop="landNature"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.landNature" placeholder="请选择">
            <el-option
              v-for="item in landNatureSelect"
              :key="item.value"
              :label="item.value"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="产权证号:"
          prop="pledgeHouseNumber"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeHouseNumber"> </el-input>
        </el-form-item>
        <!-- <el-form-item
          label="档案编码:"
          prop=" fileCoding"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.fileCoding"> </el-input>
        </el-form-item> -->
        <el-form-item
          label="不动产单元号:"
          prop=" estateUnit"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.estateUnit"> </el-input>
        </el-form-item>
        <el-form-item
          label="房屋结构:"
          prop=" houseStructure"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.houseStructure"> </el-input>
        </el-form-item>
        <el-form-item
          label="本次顺位抵押:"
          prop="orderedPledge"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.orderedPledge" placeholder="请选择">
            <el-option
              label="一抵"
              :value="0"
            >一抵</el-option>
            <el-option
              label="二抵"
              :value="1"
            >二抵</el-option>
          </el-select>
        </el-form-item>
      </div>

      <div class="form_wrap clearfix" v-if="showTwo">
        <el-form-item
          label="抵押物地址:"
          prop="pledgeHouseAddressTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input
            v-model="form.pledgeHouseAddressTwo"
            maxlength="50"
          ></el-input>
        </el-form-item>
        <el-form-item
          label="请选择省"
          prop="provinceTwoName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select
            v-model="form.provinceTwoName"
            @change="provinceFunTwo"
            placeholder="请选择"
          >
            <el-option
              v-for="item in provinceData"
              :key="item.id"
              :label="item.value"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="请选择市"
          prop="cityTwoName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select
            v-model="form.cityTwoName"
            placeholder="请选择"
            :no-data-text="cityText"
            @change="cityFunTwo"
          >
            <el-option
              v-for="item in cityDataTwo"
              :key="item.id"
              :label="item.value"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="请选择区"
          prop="areaTwoName"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select
            v-model="form.areaTwoName"
            placeholder="请选择"
            :no-data-text="areaText"
            @change="areaFunTwo"
          >
            <el-option
              v-for="item in areaDataTwo"
              :key="item.id"
              :label="item.value"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="小区名字:"
          prop="pledgeHouseNameTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeHouseNameTwo"></el-input>
        </el-form-item>
        <el-form-item
          label="房屋类型:"
          prop="pledgeHouseTypeTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.pledgeHouseTypeTwo" placeholder="请选择">
            <el-option
              v-for="item in pledgeHouse"
              :key="item.value"
              :label="item.value"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="建筑面积:"
          prop="pledgeHouseAreaTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.pledgeHouseAreaTwo" type="Number">
            <template slot="append">（平方米）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="房屋初评:"
          prop="pledgePreliminaryMoneyTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.pledgePreliminaryMoneyTwo" type="Number">
            <template slot="append">（万元）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="一抵抵押银行:"
          prop="pledgeOneBankTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeOneBankTwo"></el-input>
        </el-form-item>
        <el-form-item
          label="一抵抵押余额:"
          prop="pledgeOneBalanceTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model.number="form.pledgeOneBalanceTwo" type="Number">
            <template slot="append">（万元）</template>
          </el-input>
        </el-form-item>
        <el-form-item
          label="土地性质:"
          prop="landNatureTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-select v-model="form.landNatureTwo" placeholder="请选择">
            <el-option
              v-for="item in landNatureSelect"
              :key="item.value"
              :label="item.value"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="不动产单元号:"
          prop="estateUnitTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.estateUnitTwo"> </el-input>
        </el-form-item>
        <el-form-item
          label="房屋结构:"
          prop="houseStructureTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.houseStructureTwo"> </el-input>
        </el-form-item>
        <el-form-item
          label="产权证号:"
          prop="pledgeHouseNumberTwo"
          class="input_wrap"
          :style="{ width: width }"
        >
          <el-input v-model="form.pledgeHouseNumberTwo"> </el-input>
        </el-form-item>
      </div>
    </el-form>
  </div>
</template>


<script>
import { getDistrict, getJobStates } from "../../assets/js/api";
export default {
  name: "Information",
  created() {
    //获取省市区
    this.provinceSelect(1);
    this.getProperty();
  },
  props: {
    width: { type: String, default: "30%" },
    formData: { type: Object },
  },
  data() {
    return {
        //产品属性
      productProSelect: [],
      provinceData: [], //省
      cityData: [], //市
      areaData: [], //区
      cityDataTwo: [], //市
      areaDataTwo: [], //区
      cityText: "请先选择省",
      areaText: "请先选择市",
      showTwo: false,
      isValid: false,
      form: {
        pledgeHouseNumberTwo: null, //产权证号!
        houseStructureTwo: null,
        estateUnitTwo: null,
        evaluationPrice: null,
        basicBorrowerName: null,
        basicBorrowerCard: null,
        basicBorrowerPhone: null,
        basicBorrowerAddress: null,
        basicBorrowerWork: null,
        basicBorrowerMarriage: "未婚",
        pledgeName: null,
        pledgeCard: null,
        pledgePhone: null,
        pledgeMateName: null,
        pledgeMateCard: null,
        pledgeMatePhone: null,
        basicBorrowerMateName: null,
        basicBorrowerMateCard: null,
        basicBorrowerMatePhone: null,
        basicBorrowerMateAddress: null,
        basicBorrowerMateWork: null,
        pledgeHouseAddress: null,
        province: null,
        city: null,
        area: null,
        provinceName: null,
        cityName: null,
        areaName: null,
        pledgeHouseName: null,
        pledgeHouseType: null,
        pledgeHouseArea: null,
        pledgePreliminaryMoney: null,
        pledgeOneBank: null,
        pledgeOneBalance: null,
        basicLoansMoney: null,
        basicLoansMonths: null,
        productProperty: null,
        pledgeHouseNumber: null,
        landNature: null,
        pledgeHouseAddressTwo: null,
        provinceTwo: null,
        cityTwo: null,
        areaTwo: null,
        provinceTwoName: null,
        cityTwoName: null,
        areaTwoName: null,
        pledgeHouseNameTwo: null,
        pledgeHouseTypeTwo: null,
        pledgeHouseAreaTwo: null,
        pledgePreliminaryMoneyTwo: null,
        pledgeOneBankTwo: null,
        pledgeOneBalanceTwo: null,
        landNatureTwo: null,
        executePattern:null
      },
      // 借款人资质
      BorrowerQualification: [],
      // 签约类型！
      signing: [
        { value: 0, label: "1类" },
        { value: 1, label: "2类" },
      ],
      // 是否有涉诉！
      litigation: [
        { value: 0, label: "是" },
        { value: 1, label: "否" },
      ],
      //服务费
      serviceCharge:[

        { value: 0, label: "分期" },
        { value: 1, label: "一次性" },

      ],
      //担保约定执行方式
      fbyzzxfs:[

        { value: 0, label: "公证强制执行" },
        { value: 1, label: "仲裁" },

      ],
      //婚姻选项
      Marriage: [
        { value: "未婚", label: "未婚" },
        { value: "已婚", label: "已婚" },
        { value: "离异", label: "离异" },
      ],
      //房屋类型
      pledgeHouse: [
        { value: "高层", label: "高层" },
        { value: "洋房", label: "洋房" },
        { value: "别墅", label: "别墅" },
        { value: "楼梯房", label: "楼梯房" },
      ],

      //土地性质
      landNatureSelect: [
        { value: "出让", label: "出让" },
        { value: "划拨", label: "划拨" },
        { value: "经济适用房", label: "经济适用房" },
      ],
      formRules: {
        basicBorrowerName: [
          {
            type: "string",
            required: true,
            message: "请输入借款人姓名",
            trigger: "blur",
          },
        ],
        basicBorrowerCard: [
          { required: true, message: "请填写身份证号码", trigger: "blur" },
          {
            pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
            message: "请填写正确的身份证号码",
            trigger: "blur",
          },
        ],
        basicBorrowerPhone: [
          { required: true, message: "请填写手机号", trigger: "blur" },
          {
            pattern: /^1[345789]\d{9}$/,
            message: "请填写正确的手机号码",
            trigger: "blur",
          },
        ],
        basicBorrowerAddress: [
          {
            type: "string",
            required: true,
            message: "请输入现住地址",
            trigger: "blur",
          },
          { pattern: /[^\s]/, message: "不允许输入空格等特殊符号" },
        ],

        pledgeHouseAddress: [
          {
            type: "string",
            required: true,
            message: "请输入抵押物地址",
            trigger: "blur",
          },
          { pattern: /[^\s]/, message: "不允许输入空格等特殊符号" },
        ],
        provinceName: {
          required: true,
          message: "请选择省份",
          trigger: ["blur", "change"],
        },
        cityName: {
          required: true,
          message: "请选择市",
          trigger: ["blur", "change"],
        },
        areaName: {
          required: true,
          message: "请选择正确的区",
          trigger: ["blur", "change"],
        },
        pledgeHouseAddressTwo: [
          {
            type: "string",
            required: true,
            message: "请输入抵押物地址",
            trigger: "blur",
          },
          { pattern: /[^\s]/, message: "不允许输入空格等特殊符号" },
        ],
        provinceTwoName: {
          required: true,
          message: "请选择省份",
          trigger: ["blur", "change"],
        },
        cityTwoName: {
          required: true,
          message: "请选择市",
          trigger: ["blur", "change"],
        },
        areaTwoName: {
          required: true,
          message: "请选择正确的区",
          trigger: ["blur", "change"],
        },
        pledgeName: [
          {
            type: "string",
            required: true,
            message: "请输入抵押人姓名",
            trigger: "blur"
          }
        ],
        pledgeCard: [
          { required: true, message: "请填写身份证号码", trigger: "blur" },
          {
            pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
            message: "请填写正确的身份证号码",
            trigger: "blur"
          }
        ],
        pledgeHouseNumber:[
          {
            type: "string",
            required: true,
            message: "请输入正确产权证号",
            trigger: "blur",
          },
        ],
        pledgeHouseNumberTwo:[
          {
            type: "string",
            required: true,
            message: "请输入正确产权证号",
            trigger: "blur",
          },
        ],
      },
    };
  },
  watch: {
    formData: {
      handler(newVal) {
        let thisObj = this;
        if (newVal) {
          if (newVal.province) {
            this.getProvince(newVal.province);
          }
          if (newVal.provinceTwo) {
            this.getProvinceTwo(newVal.provinceTwo);
          }
          // thisObj.form = JSON.parse(JSON.stringify(newVal));
          thisObj.form = JSON.parse(JSON.stringify(newVal));
          console.log(thisObj.form)
          if (newVal.pledgeHouseAddressTwo) {
            this.showTwo = true;
          }
        }
      },
      immediate: true,
      deep: true,
    },
  },
  computed: {
    //是否婚配
    showMate: function () {
      if (this.form.basicBorrowerMarriage != "已婚") {
        return false;
      } else {
        return true;
      }
    },
  },
  methods: {
    // 获取产品属性数据!
      getProperty() {
      //产品属性!
      getJobStates("product_property").then((res) => {
        this.productProSelect = res.data;
        // for (let i = 0; i < this.productProSelect.length; i++) {
        //   this.productProSelect[i].itemValue = Number(
        //     this.productProSelect[i].itemValue
        //   );
        // }
        // console.log(this.productProSelect)
      });
      getJobStates("qualification").then((res) => {
        this.BorrowerQualification = res.data;
        for (let i = 0; i < this.BorrowerQualification.length; i++) {
          this.BorrowerQualification[i].itemText = Number(
            this.BorrowerQualification[i].itemText
          );
        }
      });
    },
    //验证表单
    validateForm() {
      this.$refs.inforForm.validate((valid) => {
        if (valid) {
          this.isValid = true;
        } else {
          this.isValid = false;
        }
      });
    },
    //显示第二套房子
    houseTwo() {
      this.showTwo = !this.showTwo;
      this.form.pledgeHouseAddressTwo = "";
      this.form.provinceTwoName = "";
      this.form.cityTwoName = "";
      this.form.areaTwoName = "";
      this.form.pledgeHouseNameTwo = "";
      this.form.pledgeHouseTypeTwo = "";
      this.form.pledgeHouseAreaTwo = "";
      this.form.pledgePreliminaryMoneyTwo = "";
      this.form.pledgeOneBankTwo = "";
      this.form.pledgeOneBalanceTwo = "";
      this.form.pledgeHouseAddressTwo = "";
      this.form.landNatureTwo = "";
      this.form.estateUnitTwo = "";
      this.form.houseStructureTwo = "";
    },
    // 获取省数据
    provinceSelect(val) {
      getDistrict(val).then((res) => {
        if (res.code == 200) {
          this.provinceData = res.data;
        }
      });
    },
    // 第一个抵押物获取选择省的id
    provinceFun(val) {
      this.form.province = val;
      getDistrict(val).then((res) => {
        if (res.data.length == 0) {
          (this.form.cityName = " "),
            (this.form.areaName = " "),
            (this.cityData = []),
            (this.areaData = []),
            (this.cityText = "暂无数据");
          this.areaText = "暂无数据";
          return;
        }
        this.cityData = res.data;
        this.form.city = res.data[0].id;
        this.form.cityName = res.data[0].value;
        getDistrict(res.data[0].id).then((resd) => {
          this.areaData = resd.data;
          this.form.area = resd.data[0].id;
          this.form.areaName = resd.data[0].value;
        });
      });
    },
    getProvince(val) {
      this.form.province = val;
      getDistrict(val).then((res) => {
        if (res.data.length == 0) {
          (this.form.cityName = " "),
            (this.form.areaName = " "),
            (this.cityText = "暂无数据");
          this.areaText = "暂无数据";
          return;
        }
        this.cityData = res.data;
        getDistrict(res.data[0].id).then((resd) => {
          this.areaData = resd.data;
        });
      });
    },
    // 获取选择市的id
    cityFun(val) {
      this.form.city = val;
      getDistrict(val).then((res) => {
        if (res.code == 200) {
          this.areaData = res.data;
          this.form.area = res.data[0].id;
          this.form.areaName = res.data[0].value;
          if (this.areaData.length == 0) {
            this.areaText = "暂无数据";
          }
        }
      });
    },
    areaFun(val) {
      this.form.area = val;
    },
    //第二个抵押物获取选择省的id
    provinceFunTwo(val) {
      getDistrict(val).then((res) => {
        this.form.provinceTwo = val;
        if (res.data.length == 0) {
          (this.form.cityTwoName = " "),
            (this.form.areaTwoName = " "),
            (this.cityText = "暂无数据");
          this.areaText = "暂无数据";
          return;
        }
        this.cityDataTwo = res.data;
        this.form.cityTwo = res.data[0].id;
        this.form.cityTwoName = res.data[0].value;
        getDistrict(res.data[0].id).then((resd) => {
          this.areaDataTwo = resd.data;
          this.form.areaTwo = resd.data[0].id;
          this.form.areaTwoName = resd.data[0].value;
        });
      });
    },
    getProvinceTwo(val) {
      this.form.provinceTwo = val;
      getDistrict(val).then((res) => {
        if (res.data.length == 0) {
          (this.form.cityTwoName = " "),
            (this.form.areaTwoName = " "),
            (this.cityText = "暂无数据");
          this.areaText = "暂无数据";
          return;
        }
        this.cityDataTwo = res.data;
        getDistrict(res.data[0].id).then((resd) => {
          this.areaDataTwo = resd.data;
        });
      });
    },
    // 获取选择市的id
    cityFunTwo(val) {
      (this.form.cityTwo = val),
        getDistrict(val).then((res) => {
          if (res.code == 200) {
            this.areaDataTwo = res.data;
            this.form.areaTwo = res.data[0].id;
            this.form.areaTwoName = res.data[0].value;
            if (res.data.length == 0) {
              this.areaText = "暂无数据";
            }
          }
        });
    },
    areaFunTwo(val) {
      this.form.areaTwo = val;
    },
  },
};
</script>
<style scoped type="less">
.box
{
    overflow: hidden;
}
.form_wrap
{
    box-sizing: border-box;  margin-top: 20px;  padding: 20px 20px 0;  border: 1px solid rgba(238, 238, 238, 1);  border-radius: 8px;
}
.input_wrap
{
    display: flex;  float: left;  width: 25%;  height: 33px;  margin-right: unset;
}
.input_wrap ::v-deep .el-form-item__content
{
    flex: 1;
}
.input_wrap ::v-deep .el-select
{
    line-height: 30px;  width: 100%;
}
.input_wrap ::v-deep .el-input__inner
{
    line-height: 30px;  box-sizing: border-box;
}


























</style>
